<template>
    <div>
        <van-nav-bar
                :fixed="fixed"
                title="扫一扫"
                left-text="返回"
                left-arrow
                @click-left="onClickLeft"
        />
        <div id="bcid">
            <div style="height:40%"></div>
            <p class="tip">...载入中...</p>
        </div>
        <!--<footer>-->
        <!--<button @click="startRecognize">1.创建控件</button>-->
        <!--<button @click="startScan">2.开始扫描</button>-->
        <!--<button @click="cancelScan">3.结束扫描</button>-->
        <!--<button @click="closeScan">4.关闭控件</button>-->
        <!--</footer>-->
    </div>
</template>

<script>
    let Base64 = require('js-base64').Base64;
    import {Checkbox, CheckboxGroup, Card, SubmitBar, Toast} from 'vant';

    let scan = null;
    export default {
        components: {
            [Card.name]: Card,
            [Checkbox.name]: Checkbox,
            [SubmitBar.name]: SubmitBar,
            [CheckboxGroup.name]: CheckboxGroup
        },
        data() {
            return {
                fixed: true
            };
        },
        computed: {
            submitBarText() {
                const count = this.checkedGoods.length;
                return '共计：' + (count ? `(${count})` : '');
            },
            totalPrice() {
                return this.goods.reduce((total, item) => total + (this.checkedGoods.indexOf(item.id) !== -1 ? item.price : 0), 0);
            }
        },
        methods: {
            formatPrice(price) {
                return (price / 100).toFixed(2);
            },
            onSubmit() {
                Toast('点击结算');
            },
            onClickLeft() {
                scan.close();
                this.$router.back()
            },
            //创建扫描控件
            startRecognize() {
            },
            //开始扫描
            startScan() {
                // if (!window.plus) return;
                scan.start();
            },
            //关闭扫描
            cancelScan() {
                if (!window.plus) return;
                scan.cancel();
            },
            //关闭条码识别控件
            closeScan() {
                if (!window.plus) return;
                scan.close();
            },
        },
        mounted() {
            let that = this;

            if (!window.plus) return;
            scan          = new plus.barcode.Barcode('bcid', [plus.barcode.QR]);
            scan.onmarked = onmarked;

            function onmarked(type, result, file) {
                switch (type) {
                    case plus.barcode.QR:
                        type = 'QR';
                        scan.close();
                        try {
                            let res = JSON.parse(result);
                            if (res && res.type && res.type == "pay") {//收款
                                let strs = res.url.split("/");
                                let code = Base64.decode(strs[3])
                                that.$router.replace({
                                    path: '/turnout',
                                    query: {user_id: code}
                                });
                                return;
                            }
                        }catch (e) {
                            Toast('请扫正确的收款码！');
                            that.$router.back();
                        }

                        break;
                    case plus.barcode.EAN13:
                        type = 'EAN13';
                        break;
                    case plus.barcode.EAN8:
                        type = 'EAN8';
                        break;
                    default:
                        type = '其它' + type;
                        break;
                }
            }

            scan.start();
        }
    };
</script>
<style>
    /* 二维码样式 */
    #bcid {
        width: 100%;
        position: absolute;
        left: 0;
        right: 0;
        top: 45px;
        bottom: 0;
        text-align: center;
        color: #fff;
        background: #ccc;
    }

    footer {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 1rem;
        height: 2rem;
        line-height: 2rem;
        z-index: 2;
    }

    .van-card__desc {
        margin-top: 10px;
    }

    .van-card {
        height: 70px;
        background-color: #ffffff;
        border-bottom: 1px solid #cccccc;
    }

    .van-card__thumb {
        width: 50px;
        height: 50px;
    }

    .van-card__thumb img {
        width: 50px;
        border-radius: 25px;
    }
</style>
<style scoped>
    .card-goods {
        margin-top: 46px;
        padding: 10px 0;
        background-color: #fff;
    }
</style>
